<template>
  <CommonHead :userInfo="state.userInfo" :pageType="state.pageType"/>
  <view class="content">
    <view class="title">
      稿件查看
      <image src="/static/icon_img08.png" class="img01"></image>
    </view>
    <CommonTitle  :isShowDing="false" :orderInfo="state.studentInfo"/>
    <scroll-view class="scrollMain" v-if="state.studentInfo?.order_no">
      <view class="studentTitle">学生提供内容</view>
      <view class="formMain">
        <view class="formItem">
          <view class="label">编号：</view>
          <view class="right">
            {{state.studentInfo?.order_no}}
          </view>
          <view class="copyName" @click="copyText">复制</view>
        </view>
        <view class="formItem">
          <view class="label">名称：</view>
          <view class="right">
            {{state.studentInfo?.name}}
          </view>
        </view>
        <view class="formItem">
          <view class="label">专业：</view>
          <view class="right">
            {{state.studentInfo?.major}}
          </view>
        </view>
        <view class="formItem">
          <view class="label">学校水平：</view>
          <view class="right">
            {{state.studentInfo?.school_level}}
          </view>
        </view>
        <view class="formItem">
          <view class="label">所有资料：</view>
          <view class="right">
            {{state.studentInfo?.information}}
          </view>
        </view>
        <view class="formItem formItem2">
          <view class="label">软件要求：</view>
          <view class="right">
            <view class="span">{{state.studentInfo?.software_ask_one}}</view>
            <view class="span">{{state.studentInfo?.software_ask_two}}</view>
            <view class="span">{{state.studentInfo?.software_ask_three}}</view>
          </view>
        </view>
        <view class="formItem">
          <view class="label">开题时间：</view>
          <view class="right">
            {{state.studentInfo?.middle_date}}
          </view>
        </view>
        <view class="formItem">
          <view class="label">定稿：</view>
          <view class="right">
            {{state.studentInfo?.end_date}}
          </view>
        </view>
      </view>
      
    </scroll-view>
    
  </view>
  <TabBar :active="0"/>
</template>

<script setup>
  import { reactive } from 'vue';
  import { onShow } from '@dcloudio/uni-app'
  import CommonHead from './components/head.vue'
  import TabBar from '@/components/tabBar.vue'
  import CommonTitle from '@/components/commonTitle.vue'
  import { studentIndex } from '@/utils/student.js'
  const state = reactive({
    studentInfo: null,
    pageType: 'index',
    userInfo: {}
  })
  onShow(async () => {
    state.userInfo = uni.getStorageSync('userInfo')
    const userRole = uni.getStorageSync('userRole')
    uni.setStorageSync('userRole', userRole ? userRole : 1)
    console.log(84, uni.getStorageSync('userInfo'))
    await getStudentIndex()
  })
  const getStudentIndex = async() => {
    await studentIndex({}).then((res) => {
      if (res?.code == 1) {
        state.studentInfo = res.result
        uni.setStorageSync('orderInfo', res?.result)
      }
    })
  }
 const copyText = () => {
 	uni.setClipboardData({
 		data: state.studentInfo?.order_no, // 要复制的文本
 		success: () => {
 			uni.showToast({
 				title: '复制成功',
 				icon: 'success'
 			});
 		},
 		fail: () => {
 			uni.showToast({
 				title: '复制失败',
 				icon: 'none'
 			});
 		}
 	});
 }
</script>

<style lang="scss" scoped>
  .content{
    width: 714rpx;
    height: 1100rpx;
    border-radius: 14rpx;
    background: rgba(247, 247, 247, 1);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    margin-top: 20rpx;
    margin-bottom: 140rpx;
    overflow-y: scroll;
    .title{
      font-family: PingFang SC;
      font-weight: 600;
      font-size: 40rpx;
      text-align: center;
      color: rgba(101, 115, 233, 1);
      width: 100%;
      position: relative;
      margin-top: 20rpx;
      padding-top: 10rpx;
      padding-bottom: 10rpx;
      .img01{
        width: 68rpx;
        height: 68rpx;
        position: absolute;
        top: 10rpx;
        right: 20rpx;
      }
    }
    .scrollMain{
      width: 696rpx;
      // margin-top: 20rpx;
      // height: 1000rpx;
      display: flex;
      flex-direction: column;
      justify-content: center;
      border-top: 2rpx dashed rgba(146, 146, 146, 1);
      .studentTitle{
        font-family: PingFang SC;
        font-weight: 600;
        font-size: 32rpx;
        color: rgba(101, 115, 233, 1);
        width: 100%;
        text-align: center;
        margin-top: 20rpx;
      }
      .formMain{
        width: 564rpx;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        margin: 0 auto;
        .formItem{
          display: flex;
          flex-direction: row;
          justify-content: space-between;
          align-items: center;
          margin-top: 30rpx;
          .label{
            width: 120rpx;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: flex-start;
            font-family: HarmonyOS Sans SC;
            font-weight: 400;
            font-size: 24rpx;
            color: rgba(122, 122, 122, 1);
          }
          .right{
            width: 444rpx;
            height: 46rpx;
            background: rgba(255, 255, 255, 1);
            display: flex;
            justify-content: center;
            align-items: center;
            font-family: HarmonyOS Sans SC;
            font-weight: 400;
            font-size: 24rpx;
            color: rgba(122, 122, 122, 1);
          }
          .copyName{
            width:100rpx;
            flex-shrink: 0;
            height:46rpx;
            border-radius: 20rpx;
            display: flex;
            justify-content: center;
            align-items: center;
            background: royalblue;
            font-weight: 400;
            font-size: 24rpx;
            color: #ffffff;  
            font-family: HarmonyOS Sans SC;
            margin-left: 10rpx;
          }
        }
        .formItem2{
          .right{
            background: none;
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            height: auto;
            .span{
              width: 130rpx;
              height: 72rpx;
              background: rgba(255, 255, 255, 1);
              display: flex;
              justify-content: center;
              align-items: center;
            }
          }
        }
      }
    }
  }
</style>